// 获取商品id
var goodsId = getQueryString("id");
// console.log(goodsId);//获取到id编号


var data = '';
for (var i = 0, len = detail.length; i < len; i++){
    if (detail[i].id === goodsId) {
        data = detail[i];
        break
    }
}


//商品详情页面

// 链接路径
$1(".product_link").innerHTML = `
            <li class="link1">
                <a href="./index.html">商城首页</a></li>
            <li class="link2">
                <a href="./list.html?class=${data.class}">${data.titleparent[0]}</a></li>
            <li class="link3">${data.titleparent[1]}</li>
`;

// 放入大图片，默认放入第一张，其他通过操作切换
$1(".product_show img").src = data.imggood[0];

// 渲染小图
var smallImg = '';
data.imggood.forEach(function (item) {
  var domStr = `
    <img src="${item}"  alt="" class="">
`;
  smallImg += domStr;
});

$1(".s_img").innerHTML = smallImg;

// 
$1(".product_container_right h2").innerText = data.title;
$1(".product_price i").innerText = data.price;


// 图片动态切换
var s_img = $2(".s_img img");
var index = 0;
s_img[0].className = 'act';

    $1(".scale2 img").src = data.imggood[0];

for (var i = 0, len = s_img.length; i < len; i++) {
  s_img[i].index = i;
  s_img[i].onclick = function () {
    s_img[index].className = '';
    this.className = 'act';
    index = this.index;
    $1(".product_show img").src = data.imggood[index];
    $1(".scale2 img").src = data.imggood[index];


  }
}

// 放大镜

var product_show = $1('.product_show');
var scale_content = $1('.scale_content');

var scale2 = $1('.scale2');
var scale2_img = $1('.scale2 img');

product_show.onmouseenter = function () {
scale_content.style.display = "block";
scale2.style.display = "block";
}
product_show.onmouseleave = function () {
  scale_content.style.display = "none";
  scale2.style.display = "none";
};

product_show.onmousemove = function (event) {
  var smimg_left = event.pageX - offset(product_show).left - scale_content.clientWidth / 2
  var smimg_top = event.pageY - offset(product_show).top - scale_content.clientHeight / 2
  
  // 判断边界问题

  if (smimg_left < 0) {
      smimg_left=0;
  }
   if (smimg_left > product_show.clientWidth - scale_content.clientWidth) {
     smimg_left = product_show.clientWidth - scale_content.clientWidth;
   }
  if (smimg_top < 0) {
    smimg_top=0
  }
  if (smimg_top > product_show.clientHeight - scale_content.clientHeight) {
    smimg_top = product_show.clientHeight - scale_content.clientHeight;
  }
    scale_content.style.left = smimg_left + "px";
  scale_content.style.top = smimg_top + 'px';

  var scaleX = smimg_left / (product_show.clientWidth - scale_content.clientWidth);
  var scaleY =smimg_top / (product_show.clientHeight - scale_content.clientHeight);
  var bigimg_left = scaleX * (scale2_img.clientWidth - scale2.clientWidth);
  var bigimg_top = scaleY * (scale2_img.clientHeight - scale2.clientHeight);
  console.log(bigimg_left, bigimg_top);
  scale2_img.style.left=-bigimg_left+'px';
  scale2_img.style.top = -bigimg_top+'px';
}





















// 商品描述
var desStr = "";
data.description.forEach(function (item) {
  desStr += "<li>" + item + "</li>";
});
$1(".description-good").innerHTML = desStr;

// 产品概览
var descImg = ''
data.imgds.forEach(function (item){
    descImg += '<img src="'+item+'" alt="">'
})
$1('.detail-cnt').innerHTML = descImg;